function googleMap() {
		var directionsDisplay;
		var directionsService = new google.maps.DirectionsService();
		var map;
		var endLocationArray = new Array();
		this.currentStepMarker = null;
		this.array = [];
		
		googleMap.prototype.initialize = function(lat, lon) {
		  directionsDisplay = new google.maps.DirectionsRenderer();
		  var chicago = new google.maps.LatLng(lat,lon);
		  var mapOptions = {
		    zoom:12,
		    center: chicago
		  }
		  map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
		  directionsDisplay.setMap(map);
		}
				
		this.calcRoute = function(userLat, userLon, pointLat, pointLon, order) {
			var start = new google.maps.LatLng(userLat,userLon);
			var end = new google.maps.LatLng(pointLat,pointLon);
			var request = {
		      origin:start,
		      destination:end,
		      travelMode: google.maps.TravelMode.DRIVING
		      };
			directionsService.route(request, function(response, status) {
		    if (status == google.maps.DirectionsStatus.OK) {
		      directionsDisplay.setDirections(response);
		      
		      var temp = response.routes[0].legs[0].distance.text;
		      for(var i = 0 ; i < response.routes[0].legs[0].steps.length ;i++){
		    	  temp = temp + " " + response.routes[0].legs[0].steps[i].distance.text;
		      }
		      
		      document.getElementById('route').innerHTML = temp;
		      
		      var tempPoi = {
		  				"id": order,
		  				"latitude": parseFloat(response.routes[0].legs[0].steps[order].start_location.lat()),
		  				"longitude": parseFloat(response.routes[0].legs[0].steps[order].start_location.lng()),
		  				"altitude": 10.0,
		  				"title": "POI"+ order,
		  				"description": "abc"
		  				};
		      
	    	  this.currentStepMarker = new Marker(tempPoi);
		    	  		    	  
		      //var temp = response.routes[0].legs[0].steps[0].distance.text;
		      

		    }
		  });
		}
}

function showGoogleMap() {
	//var directionsDisplay1;

	var map1;
	//var contentString;
	//var infowindow;
	showGoogleMap.prototype.initialize = function(lat, lon, listMarker) {
		//directionsDisplay1 = new google.maps.DirectionsRenderer();
		var chicago = new google.maps.LatLng(lat, lon);
		var mapOptions = {
			zoom:15,
		    center: chicago
		}
		
		map1 = new google.maps.Map(document.getElementById('map_canvas1'), mapOptions);
		
		var infoWindow = new google.maps.InfoWindow();
		
		for(var i=0; i<listMarker.length; i++){
			var newLocation = new google.maps.LatLng(listMarker[i].poiData.latitude, listMarker[i].poiData.longitude);
			var distanceToUserValue = (listMarker[i].distanceToUser > 999) ? ((listMarker[i].distanceToUser / 1000).toFixed(2) + " km") : (Math.round(listMarker[i].distanceToUser) + " m");
			var marker = new google.maps.Marker({
				position: newLocation,
			    map: map1,
			    title: "<div data-theme ='c'> " +
				"<h1>"+ listMarker[i].poiData.name+ "</h1>" + "<h4 >" + listMarker[i].poiData.description + "</h4>" +
			    "<h4>Distance: <a >" + distanceToUserValue +"</a></h4>"
			    + "<div> <a href='#info' data-role='button' data-icon='info' data-inline='true'>Show more</a></div>" +"</div>"
			});
			google.maps.event.addListener(marker, 'click', function() {
				infoWindow.setContent(this.title);
			    infoWindow.open(map1,this);
			 
			  });
			$("#poi-detail-name").html(listMarker[i].poiData.name);
			$("#poi-detail-distance").html(distanceToUserValue);
			$("#poi-detail-description").html(listMarker[i].poiData.description);
			$("#poi-detail-infomation").html(listMarker[i].poiData.details);
			$("#poi-detail-image").html(listMarker[i].poiData.image);	
			
		}
		
	}

}
